<template>
  <div class="time">
    {{ currentTime }}
  </div>
</template>

<script>
export default {
  name: 'CurrentTime',
  data() {
    return {
      currentTime: ''
    };
  },
  mounted() {
    this.updateTime();
    this.timer = setInterval(this.updateTime, 1000);
  },
  beforeDestroy() {
    clearInterval(this.timer);
  },
  methods: {
    updateTime() {
      const currentDate = new Date();
      const formattedDate = this.formatDate(currentDate);
      const formattedTime = this.formatTime(currentDate);
      this.currentTime = `${formattedDate} ${formattedTime}`;
    },
    formatDate(date) {
      const year = date.getFullYear();
      let month = date.getMonth() + 1;
      let day = date.getDate();
      month = month < 10 ? '0' + month : month;
      day = day < 10 ? '0' + day : day;
      return `${year}-${month}-${day}`;
    },
    formatTime(date) {
      let hours = date.getHours();
      let minutes = date.getMinutes();
      let seconds = date.getSeconds();
      hours = hours < 10 ? '0' + hours : hours;
      minutes = minutes < 10 ? '0' + minutes : minutes;
      seconds = seconds < 10 ? '0' + seconds : seconds;
      return `${hours}:${minutes}:${seconds}`;
    }
  }
};
</script>

